<template>
  <div class="main_container">
    <div class="top">
      <TopBar>
        <Search />
      </TopBar>
    </div>
    <div class="content">
      <!-- <GoodsWrapper v-if="goodsStore.goodsList.length" />
      <NoGoods v-else /> -->
      <GoodsWrapper />
    </div>
    <div class="footer">
      <Footer />
    </div>
    <div class="fix-nav">
      <FixNav />
    </div>
    <div class="login_box" v-if="loginStore.openLogin">
      <Login />
    </div>
  </div>
</template>

<script setup lang="ts">
import TopBar from '@/components/top/top-bar/TopBar.vue';
import Search from '@/components/top/search/Search.vue';
import FixNav from '@/components/fix-nav/FixNav.vue';
import Login from '@/components/login/Login.vue';
import Footer from '@/components/footer/footer.vue';
import GoodsWrapper from './cpm/GoodsWrapper.vue';
import { useLoginStore } from '@/stores/module/login';
import { useScrollPosition } from '@/hooks/useKeepScroll';
// import { useGoodsStore } from '@/stores/module/goods/goods.ts';
// import NoGoods from './cpm/NoGoods.vue';
const loginStore = useLoginStore()
// const goodsStore = useGoodsStore();
useScrollPosition()
</script>

<style lang="less" scoped>
.main_container {
  display: flex;
  flex-direction: column;
  height: 100vh;

  .content {
    width: 100%;
    min-width: 1168px;
    background-color: #f3f3f3;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
  }


  .fix-nav {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}
</style>
